<html>
    <head>
        <meta charset="utf-8">
        <title>在线计算器</title>
        <!-- 引入jQuery -->
        <script src="jquery-1.9.1.min.js"></script>
        <style>
            .external{
                 text-align: center;
                 margin-top: 100px;
                 background-color:lightgoldenrodyellow;
            }
        </style>

        <script>
            function myck(type){
                var operation1 =  jQuery('#num1').val();
                var operation2 =  jQuery('#num2').val();
                if(type == 1){
                    if(operation1 == ""){
                        alert("请输入数字1！")
                        return false;
                    }
                    if(operation2 == ""){
                        alert("请输入数字2！")
                        return false;
                    }
                    var total = parseInt(operation1) + parseInt(operation2);
                    jQuery("#result").html("<h2>最终执行结果：<strong style='color: #ff0000;'>"+total+"</strong></h2>");
                }
                if(type == 2){
                    if(operation1 == ""){
                        alert("请输入数字1！")
                        return false;
                    }
                    if(operation2 == ""){
                        alert("请输入数字2！")
                        return false;
                    }
                    var total = parseInt(operation1.value) - parseInt(operation2.value);
                    jQuery("#result").html("<h2>最终执行结果：<strong style='color: #ff0000;'>"+total+"</strong></h2>");

                }
                if(type == 3){
                    if(operation1 == ""){
                        alert("请输入数字1！")
                        return false;
                    }
                    if(operation2 == ""){
                        alert("请输入数字2！")
                        return false;
                    }
                    var total = parseInt(operation1)*parseInt(operation2);
                    jQuery("#result").html("<h2>最终执行结果：<strong style='color: red;'>"+total+"</strong></h2>");
                }
                if(type == 4){
                    if(confirm("是否确定清空？")){
                        jQuery("#num1").val("");  <!--  $("#num1)也可  -->
                        jQuery("#num2").val("");
                        jQuery("#result").empty();  //nice 自己寻找清除 3.23
                    }
                }
            }
        </script>

    </head>

    <body>

        <div class="external">
            <h1><font color="#c71585">6666</font></h1> <p1></p1>
            数字1：<input id="num1" type="number"> <p></p>
            数字2：<input id="num2" type="number"> <p></p>
            <input type = "button" value=" 相加 " onclick = "myck(1)">
            <input type = "button" value=" 相减 " onclick = "myck(2)">
            <input type = "button" value=" 相乘 " onclick = "myck(3)">
            <input type = "button" value=" 清空 " onclick = "myck(4)">
            <div id = "result" style = "margin-top:50px;"></div>
        </div>

    </body>

</html>